<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="jquery-1.8.0.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        /*S(":input")选取所有的input textarea select button 和$("input")不一样，$("input")只获得<input>*/
        var $alltext = $("#form1 :text");//form1后的空格要加
        var $allpassword = $("#form1 :password");
        var $allradio = $("#form1 :radio");
        var $allcheckbox = $("#form1 :checkbox");

        var $allsubmit = $("#form1 :submit");
        var $allimage = $("#form1 :image");
        var $allreset = $("#form1 :reset");
        var $allbutton = $("#form1 :button"); // <input type=button />  和 <button ></button>都可以匹配
        var $allfile = $("#form1 :file");
        var $allhidden = $("#form1 :hidden"); // <input type="hidden" />和<div style="display:none">test</div>都可以匹配.
        var $allselect = $("#form1 select");
        var $alltextarea = $("#form1 textarea");

        var $AllInputs = $("#form1 :input");
        var $inputs = $("#form1 input");

        $("div").append(" 有" + $alltext.length + " 个（ :text 元素）<br/>")
	        .append(" 有" + $allpassword.length + " 个（ :password 元素）<br/>")
			.append(" 有" + $allradio.length + " 个（ :radio 元素）<br/>")
            .append(" 有" + $allcheckbox.length + " 个（ :checkbox 元素）<br/>")
			.append(" 有" + $allsubmit.length + " 个（ :submit 元素）<br/>")
            .append(" 有" + $allimage.length + " 个（ :image 元素）<br/>")
			.append(" 有" + $allreset.length + " 个（ :reset 元素）<br/>")
			.append(" 有" + $allbutton.length + " 个（ :button 元素）<br/>")
			.append(" 有" + $allfile.length + " 个（ :file 元素）<br/>")
			.append(" 有" + $allhidden.length + " 个（ :hidden 元素）<br/>")
			.append(" 有" + $allselect.length + " 个（ select 元素）<br/>")
			.append(" 有" + $alltextarea.length + " 个（ textarea 元素）<br/>")
			.append(" 表单有 " + $inputs.length + " 个（input）元素。<br/>")
			.append(" 总共有 " + $AllInputs.length + " 个(:input)元素。<br/>")
			.css("color", "red")

        $("form").submit(function () { return false; }); // return false;不能提交. 让表单自动提交  return true时可提交  false时不可提交
    });

</script>
</head>
<body>
<form id="form1" action="#">
    <input type="button" value="Button"/><br/>
    <input type="checkbox" name="c"/>1<input type="checkbox" name="c"/>2<input type="checkbox" name="c"/>3<br/>
    <input type="file" /><br/>
    <input type="hidden" /><div style="display:none">test</div><br/>
    <input type="image" src="star1.jpg" /><br/>
    <input type="password" /><br/>
    <input type="radio" name="a"/>1<input type="radio" name="a"/>2<br/>
    <input type="reset" /><br/>
    <input type="submit" value="提交"/><br/>
    <input type="text" /><br/>
    <select><option>Option</option></select><br/>
    <textarea rows="5" cols="20"></textarea><br/>
    <button>Button</button><br/>
  </form>
 
  <div></div>

</body>
</html>

